<template>
    <require from="./em-channel-task-create.css"></require>
    <em-modal em-modal.ref="emModal" onshow.call="showHandler($event)" onapprove.call="approveHandler($event)" confirm-label="确定">
        <div slot="header">${title}${isAt ? '用户' : '频道'}任务</div>
        <div slot="content" class="em-channel-task-create">
            <div class="ui dropzone">
                <div ref="chatStatusBarRef" class="tms-status-bar dropzone-previews"></div>
                <div ref="inputRef" class="ui fluid input">
                    <div class="textareaWrapper">
                        <textarea ref="chatInputRef" placeholder=": @ 提示${isMobile ? '' : ',ctrl+enter提交,esc清空'}"></textarea>
                    </div>
                </div>
            </div>
            <div ref="previewTemplateRef" style="display: none;">
                <div class="dz-preview dz-file-preview">
                    <div class="dz-details">
                        <div class="dz-filename"><span data-dz-name></span></div>
                        <div class="dz-size" data-dz-size></div>
                        <img data-dz-thumbnail />
                    </div>
                    <div class="dz-progress"><span class="dz-upload" data-dz-uploadprogress></span></div>
                    <div class="dz-success-mark"><span>✔</span></div>
                    <div class="dz-error-mark"><span>✘</span></div>
                    <div class="dz-error-message"><span data-dz-errormessage></span></div>
                </div>
            </div>
        </div>
    </em-modal>
</template>
